<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<h:head>
<title>Log in</title>
	<link type="text/css" rel="stylesheet" href="css/dth.css" />
	<style>
.login_page {
	height: 180px;
	margin-left: 34%;
	margin-top: 5%;
	width: 325px;
	background: #0F4069;
	color: #ffffff;
	border-radius: 18px;
}

.feild_input_login {
	float: left;
	margin-bottom: 4px;
	margin-top: 4px;
	width: 300px;
	height: 30px;
	margin-left: 10px;
}
</style>
</h:head>

<h:body>

	<ui:insert name="header">
		<ui:include src="/header/header_dth.xhtml" />
	</ui:insert>
	<div style="text-align: center;">
		<div class="dth_body_home">
			<div
				style="width: 100%; height: 30%; float: left; background: #ff0fff;">
				<p:imageSwitch effect="topDown">
					<p:graphicImage value="images/banner1.jpg"></p:graphicImage>
				</p:imageSwitch>
			</div>
			<div class="dth_content">
				<p:ajaxStatus
					style="bottom: 68%;
				    height: 32px;
				    position: fixed;
				    right: 50%;
				    width: 32px;
				    z-index: 99999;">
					<f:facet name="start">
						<p:graphicImage value="images/loading.gif" />
					</f:facet>

					<f:facet name="complete">
						<h:outputText value="" />
					</f:facet>
				</p:ajaxStatus>
				<div class="login_page">
					<h:form>
						<div class="feild_input_login" style="margin-top: 32px;">
							<h:outputLabel style="width:30%;" value="#{msg['login_username']}"></h:outputLabel>
							<h:inputText value="#{loginBean.userName}"
								style="margin-left: 25px;height:20px;" size="30"></h:inputText>
						</div>
						<div class="feild_input_login">
							<h:outputLabel style="width:30%;" value="#{msg['login_password']}"></h:outputLabel>
							<h:inputSecret  value="#{loginBean.password}"
								style="margin-left: 29px;height:20px;" size="30"></h:inputSecret>
						</div>
						<h:outputText id="mess_error" value="#{loginBean.invaildAccountMessage}"></h:outputText>
						<div
							style="float: left; font-size: 18px; height: 40%; padding-left: 29%; padding-top: 3%; width: 67%;">
							<p:commandButton value="#{msg['login_sign_up']}" action="#{loginBean.signUp}"></p:commandButton>
							<p:commandButton value="#{msg['login_login']}" action="#{loginBean.checkLogin}" update="mess_error"
								style="margin-left:10px;">
								</p:commandButton>
						</div>
					</h:form>
				</div>
			</div>
		</div>
	</div>
	<ui:insert name="header">
		<ui:include src="/footer/footer_dth.xhtml" />
	</ui:insert>

</h:body>
</html>